import QtQuick 1.0

Rectangle {
    id: screen

    width: 420; height: 380

    SystemPalette { id: activePalette }

   function showDialog( msg ) {
      //console.log( "QML::Samegame::Rectangle::ShowDialog: Message = ", msg )
      dialog.show( msg )
   }
   
   function hideDialog() {
      //console.log( "QML::Samegame::Rectangle::HideDialog" )
      dialog.hide()
   }

   function showScoreTip( msg ) {
      console.log( "QML::Samegame::Rectangle::showScoreTip: Message = ", msg )
      scoretip.show( msg )
   }
   
   function hideScoreTip() {
      console.log( "QML::Samegame::Rectangle::hideScoreTip" )
      scoretip.hide()
   }

    Item {
        width: parent.width
        anchors { top: parent.top; bottom: toolBar.top }

       Image {
            id: background
            objectName: "background"
            anchors.fill: parent
            source: "../images/background.png"
            fillMode: Image.PreserveAspectCrop
        }
        
        Item {
            id: gameCanvas
            objectName: "gameCanvas"

            property int score: 0
            property int blockSize: 40

            width: parent.width - (parent.width % blockSize)
            height: parent.height - (parent.height % blockSize)
            anchors.centerIn: parent

            MouseArea {
                anchors.fill: parent
                hoverEnabled: true
                onClicked: { controller.mouseClicked( mouse.x, mouse.y ) }
                onPositionChanged: {
                   controller.positionChanged( mouse.x, mouse.y )
                   scoretip.x = mouse.x + 12
                   scoretip.y = mouse.y + 10
                }
                onExited: { controller.onMouseExit() }
            }
            
            ScoreTip {
               id: scoretip
               z: 400
            }
        }
    }

   Dialog {
      id: dialog
      anchors.centerIn: parent
      z: 100
   }

    Rectangle {
        id: toolBar
        width: parent.width; height: 30
        color: activePalette.window
        anchors.bottom: screen.bottom

        Button {
            anchors { left: parent.left; verticalCenter: parent.verticalCenter }
            text: "New Game"
            anchors.leftMargin: 6
            onClicked: { controller.newGameClicked() }
        }

        Text {
            id: score
            anchors { right: parent.right; verticalCenter: parent.verticalCenter }
            text: "Score: " + gameCanvas.score
            anchors.rightMargin: 7
        }
    }
}
